<template>
	<view class="message-emitter" :class="{'safeArea':$systemInfo.platform == 'ios'}">
		<view class="message-emitter-publish-container">
			<view class="publish-center-wrapper" :class="{'disabled':isInputDisabled}">
				<textarea v-model="textMessageValue" :show-confirm-bar="false" class="text-input"
					:auto-height="isTextInputHightAuto" :adjust-position="false" confirm-type="send"
					@keyboardheightchange="keyboardheightchange" :disabled="isInputDisabled"
					:placeholder="isInputDisabled?'咨询已结束':''"
					ref="textInput" ></textarea>
			</view>
			<view class="publish-right-wrapper">
					<button class="submit-button" @click="submitTextMessage">发送</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				textMessageValue: '',
			}
		},
		computed: {
			isTextInputHightAuto() {
				return this.textMessageValue.length <= 68;
			},
		},
		props:{
			isInputDisabled:{
				type:Boolean,
				default:false,
			}
		},
		methods: {
			keyboardheightchange(e) {
				this.$emit('keyboardheightchange', e.detail);
			},
			submitTextMessage() {
				this.$emit('submitTextMessage', this.textMessageValue);
				this.textMessageValue = '';
			},
		}
	}
</script>

<style scoped lang="scss">
	@import "./messageEmitter.scss";
</style>
